<template>
  <div >
		<h1>系统登录</h1>
		<el-form ref="formObj" :rules="rules" :model="wyform" label-width="80px">
			<el-form-item label="登录名" prop="username">
				<el-input v-model="wyform.username" placeholder="请输入手机号/电子邮件"></el-input>
			</el-form-item>
			<el-form-item label="登录密码" prop="password">
				<el-input v-model="wyform.password" placeholder="请输入登录密码" show-password></el-input>
			</el-form-item>
			<el-form-item label-width="0px">
				<div style="width: 100%; display: flex; justify-content: space-between;">
					<el-link type="primary" @click="regist">注册</el-link>
					<el-link type="primary" @click="findpwd">找回密码</el-link>
				</div>
			</el-form-item>
			<el-form-item label-width="0px">
				<el-button style="width: 100%;" type="primary" @click="login">登录</el-button>
			</el-form-item>
		</el-form>
		<el-dialog
			v-model="showDialog"
			title="用户注册"
			width="550px"
			append-to-body>
			<Editor v-model:show="showDialog" />
		</el-dialog>
  </div>
</template>

<script setup>
import { reactive, ref } from 'vue'
import Editor from '@@/user/editor'
import { post } from '@/axios'
import { useTokenStore } from '@/stores'
import router from '@/router'
const tokenStore = useTokenStore()
const formObj = ref()
const emits = defineEmits(['update:r'])
const wyform = reactive({
	username: '',
	password: ''
})
const rules = {
	username: [
		{ required: true, message: '请输入登录名', trigger: 'blur' }
	],
	password: [
		{ required: true, message: '请输入登录密码', trigger: 'blur' }
	]
}
const showDialog = ref(false)
function findpwd () {
	emits('update:r', 180)
}
function regist () {
	showDialog.value = true
}
function login () {
	post('/umsDoctor/login', wyform, content => {
		console.dir(content)
		tokenStore.setToken(content)
		router.push('/home')
	}, formObj)
}
</script>

<style scoped lang="scss">
h1 {
	text-align: center;
}
.el-form {
	margin-top: 25px;
	margin-right: 50px;
	margin-left: 50px;
}
</style>